<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>排班</title>
    <!--引入vue得依赖必须再elementui之前引入vue-->
    <link type="text/css" rel="stylesheet" href="css/index.css">
    <script type="text/javascript" src="/js/vue.js"></script>
    <script type="text/javascript" src="/js/index.js"></script>
    <script type="text/javascript" src="/js/axios.min.js"></script>
    <script type="text/javascript" src="/js/qs.min.js"></script>
    <style>
        #centertitle{
            text-align: center;
        }
        table{
            border: black solid 1px;
            margin-left: 50px;
        }
        #td{
            width: 240px;
            height: 50px;
        }
        #td1{
            width: 120px;
            text-align: center;
        }
        th{
            border: black solid 1px;
        }
        td{
            border: black solid 1px;
            width: 50px;
            height: 50px;
            text-align:center;
        }
        #im{
            float:left;
            margin-top: 5px;
            margin-left: 2px;
        }
        #re{
            float:right;
        }
        #la{
            width:300px;
            /*border:0px solid #900;*/
            padding:0px;
            overflow:hidden
        }
        .divleft{
            float:left;
            width:75px;
            font-weight:600;
            /*border:0px solid #060;*/
        }
        .divright{
            margin-top:8px;
            float:right;
            width:220px;
            /*border:0px solid #00F;*/
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 3;
            overflow: hidden;
        }
    </style>
</head>
<body>
    <div id="centertitle">
        <h1>排班管理系统</h1>
    </div>

    <div id="app">
        <table cellpadding="0px" cellspacing="0px">
            <tr>
                <th id="td">医生信息</th>
                <th id="td1" V-for="timesss in timess">{{timesss}}</th>
            </tr>
            <tr  v-for="admin in admins">
                <td>
                    <div id="la">
                        <div id="im">
                            <img :src="admin.img" class="avatar" width="70px" height="80">
                        </div>
                        <div id="re">
                            <div class="divleft">{{admin.name}}</div><br/>
                            <div class="divright">{{admin.introduction}}</div>
                        </div>
                    </div>
                </td>
                <td>
                    <span v-if="admin.date1==1">{{admin.count1}}/{{admin.num1}}</span>
                    <el-button type="primary" plain v-if="admin.date1==0" @click="add(admin.account,admin.date11)">安排</el-button>
                </td>
                <td>
                    <span v-if="admin.date2==2">{{admin.count2}}/{{admin.num2}}</span>
                    <el-button type="primary" plain v-if="admin.date2==0" @click="add(admin.account,admin.date22)">安排</el-button>
                </td>
                <td>
                    <span v-if="admin.date3==3">{{admin.count3}}/{{admin.num3}}</span>
                    <el-button type="primary" plain v-if="admin.date3==0" @click="add(admin.account,admin.date33)">安排</el-button>
                </td>
                <td>
                    <span v-if="admin.date4==4">{{admin.count4}}/{{admin.num4}}</span>
                    <el-button type="primary" plain v-if="admin.date4==0" @click="add(admin.account,admin.date44)">安排</el-button>
                </td>
                <td>
                    <span v-if="admin.date5==5">{{admin.count5}}/{{admin.num5}}</span>
                    <el-button type="primary" plain v-if="admin.date5==0" @click="add(admin.account,admin.date55)">安排</el-button>
                </td>
                <td>
                    <span v-if="admin.date6==6">{{admin.count6}}/{{admin.num6}}</span>
                    <el-button type="primary" plain v-if="admin.date6==0" @click="add(admin.account,admin.date66)">安排</el-button>
                </td>
                <td>
                    <span v-if="admin.date7==7">{{admin.count7}}/{{admin.num7}}</span>
                    <el-button type="primary" plain v-if="admin.date7==0" @click="add(admin.account,admin.date77)">安排</el-button>
                </td>
            </tr>
        </table>
    </div>

    <script>
        var app = new Vue({
            el:"#app",
            data:{
                timess:[],
                admins:{},
            },
            created(){
                this.schedulinit();
                this.times();
            },
            methods:{
                schedulinit() {
                    axios.post("/ManaginePrivilegesController/selectSectionDoctors").then(resp=>{
                        this.admins=resp.data.data;
                        console.log(this.admins);
                    });
                },

                //获得表头时间
                times(){
                    axios.post("/ManaginePrivilegesController/getCurrentTimes").then(resp=>{
                        this.timess=resp.data.data;
                        console.log(this.timess);
                    });
                },
                add(account,date){
                    axios.post("/ManaginePrivilegesController/idDate?account="+account+"&date="+date).then(resp=>{
                        location.href="/addduty.html";
                    });
                }
            }
        });
    </script>
</body>
</html>